<template>
 <div>
  <el-form label-position="right" label-width="90px" ref="form" :rules="rules" :model="form">
    <el-row :gutter="10">
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="老人姓名" prop="name">
          <el-input v-model="form.name" placeholder="请输入老人姓名"></el-input>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="身份证号" prop="cardid">
          <el-input v-model="form.cardid" @blur="checkIdCard" placeholder="请输入身份证号"></el-input>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="年龄" prop="age">
          <el-input v-model="form.age" placeholder="请输入年龄"></el-input>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="性别" prop="sex">
          <el-select v-model="form.sex" placeholder="请选择性别">
            <el-option label="男" value="1"></el-option>
            <el-option label="女" value="2"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="出生日期" prop="birthday">
          <el-date-picker
            v-model="form.birthday"
            align="right"
            type="date"
            placeholder="请选择出生日期"
            value-format="yyyy-MM-dd"
            style="width: 100%;"
            :picker-options="pickerOptions">
          </el-date-picker>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="联系方式" prop="mobile">
          <el-input v-model="form.mobile" placeholder="请输入联系方式"></el-input>
        </el-form-item>
      </el-col>
      <!-- <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="老人类型" prop="s_type">
          <el-select v-model="form.s_type" placeholder="请选择老人类型">
            <el-option label="日间照料老人" value="1"></el-option>
            <el-option label="上门服务老人" value="2"></el-option>
          </el-select>
        </el-form-item>
      </el-col> -->
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="负责站点" prop="team_id">
          <el-select v-model="form.team_id" clearable placeholder="请选择负责站点">
            <el-option
              v-for="item in teamList"
              :key="item.id"
              :label="item.name"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="老人来源" prop="source_type">
          <el-select v-model="form.source_type" clearable placeholder="请选择老人来源">
            <el-option
              v-for="item in dictData.elderSource"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
     <!-- <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="所属网格" prop="wangge_id">
          <el-select v-model="form.wangge_id" filterable placeholder="请选择所属网格">
            <el-option-group
              v-for="group in wanggeList"
              :key="group.label"
              :label="group.label">
              <el-option
                v-for="item in group.options"
                :key="item.id"
                :label="`${item.leader}-${item.name}`"
                :value="item.id">
                <span style="float: left">{{ item.leader }}</span>
                <span style="float: right; color: #8492a6; font-size: 13px">{{ item.name }}</span>
              </el-option>
            </el-option-group>
          </el-select>
        </el-form-item>
      </el-col> -->
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="老人类别" prop="type">
          <el-select v-model="form.type" clearable placeholder="请选择老人类别">
            <el-option
              v-for="item in dictData.elderlyCategory"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="会员等级" prop="vip">
          <el-select v-model="form.vip" placeholder="请选择会员等级">
            <el-option label="vip用户" value="1"></el-option>
            <el-option label="普通用户" value="0"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <!-- <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="健康膳食" prop="healthlist">
          <el-select v-model="form.healthlist" collapse-tags multiple clearable placeholder="请选择健康膳食">
            <el-option
              v-for="item in mealTypeList"
              :key="item.name"
              :label="item.name"
              :value="item.name">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col> -->
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="城镇/农村" prop="type1">
          <el-select v-model="form.type1" clearable placeholder="请选择城镇/农村">
            <el-option label="城镇" value="1"></el-option>
            <el-option label="农村" value="2"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="三类老人" prop="type2">
          <el-select v-model="form.type2" clearable placeholder="请选择三类老人">
            <el-option label="重点服务对象" value="1"></el-option>
            <el-option label="适老化改造人员" value="2"></el-option>
            <el-option label="分散特困" value="3"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="特殊群体" prop="special">
          <el-select v-model="form.special" clearable multiple placeholder="请选择特殊群体">
            <el-option
              v-for="(item, index) in dictData.specialTipe"
              :key="index"
              :label="item.label"
              :value="item.label">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="民族" prop="nation_id">
          <el-select v-model="form.nation_id" clearable placeholder="请选择民族">
            <el-option
              v-for="item in nation"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="宗族信仰" prop="religion_id">
          <el-select v-model="form.religion_id" clearable placeholder="请选择宗族信仰">
            <el-option
              v-for="item in dictData.religion"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="婚姻状态" prop="marry">
          <el-select v-model="form.marry" clearable placeholder="请选择婚姻状态">
            <el-option
              v-for="item in dictData.marriage"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>

      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="居住情况" prop="live_type">
          <el-select v-model="form.live_type" clearable placeholder="请选择居住情况">
            <el-option
              v-for="item in dictData.liveCategory"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="劳动能力" prop="work_status">
          <el-select v-model="form.work_status" clearable placeholder="请选择劳动能力">
            <el-option
              v-for="item in dictData.workCategory"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="文化程度" prop="edu_status">
          <!-- <el-select v-model="form.edu_status" clearable placeholder="请选择文化程度">
            <el-option
              v-for="item in locales.degreeCategory"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select> -->
          <el-input v-model="form.edu_status" placeholder="请输入文化程度"></el-input>
        </el-form-item>
      </el-col>
     <!-- <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="省" prop="province_id">
          <el-select v-model="form.province_id" value-key="id" clearable filterable @change="handleProvince" placeholder="请选择省">
            <el-option
              v-for="item in provinceList"
              :key="item.id"
              :label="item.name"
              :value="item">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="市" prop="city_id">
          <el-select v-model="form.city_id" value-key="id" clearable filterable @change="handleCity" placeholder="请选择市">
            <el-option
              v-for="item in cityList"
              :key="item.id"
              :label="item.name"
              :value="item">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="区/县" filterable prop="area_id">
          <el-select v-model="form.area_id" value-key="id" clearable filterable @change="handleArea" placeholder="请选择区/县">
            <el-option
              v-for="item in areaList"
              :key="item.id"
              :label="item.name"
              :value="item">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="村镇/街道" filterable prop="town_id">
          <el-select v-model="form.town_id" value-key="id" clearable filterable @change="handleTown" placeholder="请选择村镇/街道">
            <el-option
              v-for="item in townList"
              :key="item.id"
              :label="item.name"
              :value="item">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col> -->
      <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
        <el-form-item label="所在地" prop="areaArr">
          <el-cascader
            ref="cascaderAddr2"
            v-model="form.areaArr"
            :options="addressData"
            :show-all-levels="true"
            :props="{ expandTrigger: 'hover' }"
            style="width: 100%"
            placeholder="请选择所在地"
            @change="handleChangeAddress"
          ></el-cascader>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
        <el-form-item label="详细地址" prop="xiaoqu">
          <el-input v-model="form.xiaoqu" placeholder="请输入详细地址"></el-input>
        </el-form-item>
      </el-col>
      <!-- <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="小区" prop="xiaoqu">
          <el-input v-model="form.xiaoqu" @blur="handleXiaoqu" placeholder="请输入小区"></el-input>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="楼栋" prop="louhao">
          <el-input v-model="form.louhao" placeholder="请输入楼栋"></el-input>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="单元" prop="danyuan">
          <el-input v-model="form.danyuan" placeholder="请输入单元"></el-input>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
        <el-form-item label="门牌号" prop="menpai">
          <el-input v-model="form.menpai" placeholder="请输入门牌号"></el-input>
        </el-form-item>
      </el-col> -->
      <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
         <el-form-item label="获取经纬度" prop="lat">
           <el-row>
             <el-col :xs="5" :sm="5" :md="5" :lg="5" :xl="5">
               <el-input
                 v-model="form.lng"
                 :disabled="true"
                 placeholder="请获取经纬度"
               ></el-input>
             </el-col>
             <el-col
               :xs="1"
               :sm="1"
               :md="1"
               :lg="1"
               :xl="1"
               style="text-align: center"
             >
               --
             </el-col>
             <el-col :xs="5" :sm="5" :md="5" :lg="5" :xl="5">
               <el-input
                 v-model="form.lat"
                 placeholder="请获取经纬度"
                 :disabled="true"
               ></el-input>
             </el-col>
             <el-col
               :xs="1"
               :sm="1"
               :md="1"
               :lg="1"
               :xl="1"
               style="text-align: center"
             >
               -
             </el-col>
             <el-col :xs="5" :sm="5" :md="5" :lg="5" :xl="5">
               <el-button size="medium" type="primary" @click="handleMap">
                 获取经纬度
               </el-button>
             </el-col>
           </el-row>
         </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
        <el-form-item label="" prop="lat">
          <el-button type="primary" @click="openCamera">开启拍照功能</el-button>
          <el-button type="primary" @click="closeCamera">关闭拍照功能</el-button>
        </el-form-item>
      </el-col>
      <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
        <el-row :gutter="10">
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
            <el-form-item label="老人照片" prop="avatar" class="imgUpload-solderAdd">
              <!-- <div class="imgUploadDiv" @click="handleResultAvatar">
                <img-upload
                  v-model="form.avatar"
                  tips=""
                  method="profile"
                  :imgurl="profile_avatar"
                  :updisabled="upDisabled"
                  @result="resultAvatar"
                >
                </img-upload>
              </div> -->
              <el-upload
                class="avatar-uploader"
                action="#"
                :auto-upload="false"
                :show-file-list="false"
                :on-change="changePictureUploadAvatar">
                <img v-if="form.avatar" :src="form.avatar" class="avatar">
                <i v-else class="el-icon-user-solid avatar-uploader-icon" aria-hidden="true"></i>
              </el-upload>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
            <el-form-item label="身份证正面" prop="id_card_front" class="imgUpload-solderAdd">
              <!-- <div class="imgUploadDiv" @click="handleResultAvatar">
                <img-upload
                  v-model="form.id_card_front"
                  tips=""
                  method="profile"
                  :imgurl="profile_id_card_front"
                  :updisabled="upDisabled"
                  @result="resultAvatarIDCardFront"
                >
                </img-upload>
              </div> -->
              <el-upload
                class="avatar-uploader"
                action="#"
                :auto-upload="false"
                :show-file-list="false"
                :on-change="changePictureUploadIDFront">
                <img v-if="form.id_card_front" :src="form.id_card_front" class="id_card_front">
                <img v-else src="@/assets/images/sfyz_zm.png" class="id_card_front">
              </el-upload>

            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
            <el-form-item label="身份证反面" prop="id_card_back" class="imgUpload-solderAdd">
             <!-- <div class="imgUploadDiv" @click="handleResultAvatar">
                <img-upload
                  v-model="form.id_card_back"
                  tips=""
                  method="profile"
                  :imgurl="profile_id_card_back"
                  :updisabled="upDisabled"
                  @result="resultAvatarIDCardBack"
                >
                </img-upload>
              </div> -->
                <el-upload
                  class="avatar-uploader"
                  action="#"
                  :auto-upload="false"
                  :show-file-list="false"
                  :on-change="changePictureUploadIDBack">
                  <img v-if="form.id_card_back" :src="form.id_card_back" class="id_card_front">
                  <img v-else src="@/assets/images/sfyz_fm.png" class="id_card_front">
                </el-upload>
            </el-form-item>
          </el-col>
        </el-row>
      </el-col>
    </el-row>
    <el-form-item class="contacts-add">
      <el-button type="primary" @click="onSubmit">提交</el-button>
      <el-button @click="cancle">关闭</el-button>
    </el-form-item>
  </el-form>
  <!-- 摄像头使用 -->
  <el-drawer v-if="dialogVisible" title="拍照上传" :size="500" :visible.sync="dialogVisible" @close="closeDrawer" :wrapperClosable="false" :modal="false" direction="ttb">
    <camera-module ref="cameraChild" @upload="upload"></camera-module>
  </el-drawer>
</div>
</template>
<script>
import { solderNation, teamIndex, solderAdd, solderEdit, idcardapi, findidcard, solderInfo } from '@/api/solder'
import imgUpload from "@/components/AppUpload/index";
import dictData from "@/utils/dictionary";
import * as APIWangge from "@/api/wangge";
import * as RegExp from '@/utils/RegExp';
import addressData from "@/utils/address";
import { age } from "@/utils"
import cameraModule from '@/components/camera-module'
import { uploadFilePromise } from '@/api/upload'
export default {
  name: 'task-icon-add',
  components: { imgUpload, cameraModule },
  props: {
    data: {
      type: Object,
      default: () => {}
    },
    typeList: {
      type: Array,
      default: () => {}
    }
  },
  data () {
    return {
      dictData,
      // 日期设置
      pickerOptions: {
        disabledDate (time) {
          return time.getTime() > Date.now()
        }
      },
      form: {
        name: '',
        cardid: '',
        age: '',
        sex: '',
        birthday: '',
        mobile: '',
        nation_id: '',
        religion_id: '',
        marry: '',
        type: '',
        live_type: '',
        work_status: '',
        edu_status: '',
        source_type: '1',
        province_id: '',
        city_id: '',
        area_id: '',
        town_id: '',
        xiaoqu: '',
        louhao: '',
        danyuan: '',
        menpai: '',
        team_id: '',
        s_type: '2',
        lng: '',
        lat: '',
        avatar: '',
        id_card_front: '',
        id_card_back: '',
        special: [],
        areaArr:[]
      },
      dialogVisible: false,
      addressData: [],
      methodType:'profile',
      profile_avatar:'',
      upDisabled: false,
      profile_id_card_front: require("@/assets/images/sfyz_zm.png"),
      profile_id_card_back: require("@/assets/images/sfyz_fm.png"),
      // 表单校验
      rules: {
        name: [
          {
            required: true,
            message: '请输入用户名',
            trigger: 'blur'
          }
        ],
        cardid: [
          {
            required: true,
            message: '请输入身份证号',
            trigger: 'blur'
          }
        ],
        age: [
          {
            required: true,
            message: '请输入年龄',
            trigger: 'blur'
          }
        ],
        sex: [
          {
            required: true,
            message: '请选择性别',
            trigger: 'blur'
          }
        ],
        birthday: [
          {
            required: true,
            message: '请选择出生日期',
            trigger: 'blur'
          }
        ],
        mobile: [
          {
            required: true,
            message: '请输入联系方式',
            trigger: 'blur'
          }
        ],
        s_type: [
          {
            required: true,
            message: '请选择老人类型',
            trigger: 'blur'
          }
        ]
      },
      olderid:'0',
      teamList:[],
      wanggeList:[],
      mealTypeList:[],
      nation:[],
      areaString:''
    }
  },
  mounted () {
    const self = this;
    self.addressData = addressData;
    self.$init();
  },
  methods: {
    // 上传头像
    changePictureUploadAvatar (file) {
      uploadFilePromise(file).then(res => {
        if(res.code == 200){
           this.form.avatar = res.data;
           this.$message({ type: "success", message: "上传成功!"});
        }
      })
    },
    // 上传身份证正面
    changePictureUploadIDFront (file) {
      uploadFilePromise(file).then(res => {
        if(res.code == 200){
           this.form.id_card_front = res.data;
           this.$message({ type: "success", message: "上传成功!"});
        }
      })
    },
    // 上传身份证反面
    changePictureUploadIDBack (file) {
      uploadFilePromise(file).then(res => {
        if(res.code == 200){
           this.form.id_card_back = res.data;
           this.$message({ type: "success", message: "上传成功!"});
        }
      })
    },
    // 静态化加载
    async $init () {
      const values = await Promise.all([
        // 民族信息
        solderNation(),
        // 站点列表
        teamIndex({ page_size: 100 })
      ])
      this.teamList = values[1]['data']['list']
      const nation = values[0]['data']
      const nationArr = []
      for (const item in nation) {
        nationArr.push({
          label: String(nation[item]),
          value: item
        })
      }
      this.nation = nationArr
    },
    // 身份校验检测
    async checkIdCard () {
      const { cardid } = this.form
      if (cardid === '') {
        this.$message.warning('请输入身份证号码')
        return false
      }
      if (!RegExp.IDCard.test(cardid)) {
        // return false
      } else {
        const birthday = cardid.substring(6, 10) + '-' + cardid.substring(10, 12) + '-' + cardid.substring(12, 14)

        // this.form.birthday = birthday
        if (parseInt(cardid.substr(16, 1)) % 2 === 1) {
          this.form.sex = '1'
        } else {
          this.form.sex = '2'
        }
        const myDate = new Date()
        const month = myDate.getMonth() + 1
        const day = myDate.getDate()
        let age = myDate.getFullYear() - cardid.substring(6, 10) - 1
        if ((cardid.substring(10, 12) < month || cardid.substring(10, 12) === month) && cardid.substring(12, 14) <= day) {
          age++
        }
        // this.form.age = age
        this.form = { ...this.form, ...{ birthday, age } }
        const exists = await findidcard({ idcard: cardid })
        if (exists.data) {
          this.$message.warning('此身份证号已被使用')
        }
      }
    },
    // 获取老人信息
    getOlderInfo () {
      const self = this;
      solderInfo({ id: this.form.id }).then(resp => {
        const res = resp.data;
        const areaArrData = [];
        if(res['province_id'] && res['city_id'] && res['area_id']){
          areaArrData.push(res['province_id'].toString());
          areaArrData.push(res['city_id'].toString());
          areaArrData.push(res['area_id'].toString());
        }
        this.form = Object.assign({}, this.form, res, {
          sex: res.sex &&String(res.sex),
          source_type: res.source_type && String(res.source_type),
          type: res.type && String(res.type),
          vip: res.vip && String(res.vip),
          type1: res.type1 && String(res.type1),
          type2: res.type2 && String(res.type2),
          live_type: res.live_type && String(res.live_type),
          marry: res.marry && String(res.marry),
          nation_id: res.nation && String(res.nation),
          religion_id: res.religion && String(res.religion),
          work_status: res.work && String(res.work),
          edu_status: res.edu && String(res.edu),
          cardid: res.id_card,
          province_id: res.province,
          avatar: res.profile,
          special: res.special_tipe && res.special_tipe.split(',') || [],
          healthlist: res.health && res.health.split(',') || [],
          age: age(res.birthday,"age"),
          areaArr: areaArrData,
        })
        if(res['id_card_back']){
          self.profile_id_card_back = res['id_card_back'];
        }
        if(res['id_card_front']){
          self.profile_id_card_front = self.profile_id_card_front;
        }
      })
    },
    // 关闭弹窗
    closeDrawer () {
      // 销毁摄像头
      this.$refs.cameraChild.destoryStop()
    },
    // 打开摄像头
    openCamera () {
      this.dialogVisible = true
    },
    // 关闭摄像头
    closeCamera () {
      this.show = false
    },
    // 裁剪图片上传
    upload (type, imgSrc) {
      this.form[type] = imgSrc
      if (type === 'id_card_front') {
        idcardapi({ img: imgSrc }).then(res => {
          if(res.code != 200) return
          const data = JSON.parse(res.data);
          if (data.image_status === 'normal') {
            this.form.name = data.words_result['姓名'].words
            this.form.cardid = data.words_result['公民身份号码'].words
            const minzu = data.words_result['民族'].words
            this.nation.forEach(item => {
              if (item.label === minzu) {
                this.form.nation_id = item.value
              }
            })
            this.checkIdCard()
          }
          switch (data.image_status) {
            case 'normal':
              this.$message.success('识别完成')
              break
            case 'reversed_side':
              this.$message.warning('身份证正反面颠倒')
              break
            case 'non_idcard':
              this.$message.warning('上传的图片中不包含身份证')
              break
            case 'blurred':
              this.$message.warning('身份证模糊')
              break
            case 'other_type_card':
              this.$message.warning('请放至居民身份证进行拍照')
              break
            case 'over_exposure':
              this.$message.warning('身份证曝光严重，无法识别')
              break
            case 'over_dark':
              this.$message.warning('亮度太低，请打开光源')
              break
          }
          switch (data.idcard_number_type) {
            case -1:
              this.$message.warning('身份证正面所有字段全为空')
              break
            case 0:
              this.$message.warning('身份证证号不合法，此情况下不返回身份证证号')
              break
            case 2:
              this.$message.warning('身份证证号和性别、出生信息都不一致')
              break
            case 3:
              this.$message.warning('身份证证号和出生信息不一致')
              break
            case 4:
              this.$message.warning('身份证证号和性别信息不一致')
              break
            default:
              break
          }
        })
      }
    },
    handleResultAvatar() {
      this.methodType = "img";
    },
    resultAvatar(data) {
      this.$set(this.form, "avatar_id", data.id);
    },
    resultAvatarIDCardFront(data) {
      this.profile_id_card_front = '';
      this.$set(this.form, "id_card_front_id", data.id);
    },
    resultAvatarIDCardBack(data) {
       this.profile_id_card_back = '';
      this.$set(this.form, "id_card_back_id", data.id);
    },
    lead () {
      this.form.msg = this.mealTemp
      this.$forceUpdate()
    },
    handleChangeAddress(value, form, label) {
        if(this.$refs.cascaderAddr2.$refs.panel.getCheckedNodes()[0]){
          let areaString = this.$refs.cascaderAddr2.$refs.panel
           .getCheckedNodes()[0]
           .pathLabels.join(",");
           this.areaString = areaString;
        }
    },
    handleMap() {
      if (!this.form.areaArr || this.form.areaArr == "") {
        this.$message({
          type: "warning",
          message: "请先选择所在地",
        });
        return false;
      }
      if (!this.form.xiaoqu || this.form.xiaoqu == "") {
        this.$message({
          type: "warning",
          message: "请先填写详细地址",
        });
        return false;
      }
      if(this.$refs.cascaderAddr2.$refs.panel.getCheckedNodes()[0]){
        let areaString = this.$refs.cascaderAddr2.$refs.panel
         .getCheckedNodes()[0]
         .pathLabels.join(",");
         this.areaString = areaString;
      }
      this.$emit("handleMap", this.areaString + this.form.xiaoqu);
    },
    // 提交老人基本信息
    onSubmit () {
      if (this.form.hasOwnProperty('id')) {
        this.$refs.form.validate((valid) => {
          if (valid) {
            const { province_id, town_id, city_id, area_id, special, healthlist } = this.form
            const params = Object.assign({}, this.form, {
              // id: this.olderid,
              province_id: this.form.areaArr[0],
              city_id: this.form.areaArr[1],
              area_id: this.form.areaArr[2],
              town_id: '',
              special_tipe: special.join(','),
              // health: healthlist.join(',')
            })
            delete params['areaArr'];
            solderEdit(params).then(res => {
               this.$message({type: "success",  message: "修改成功" });
               this.cancle()
               this.load()
            })
          }
        })
      } else {
        this.$refs.form.validate((valid) => {
          if (valid) {
            const { province_id, town_id, city_id, area_id, special, healthlist } = this.form
            const params = Object.assign({}, this.form, {
              // id: this.olderid,
              province_id: this.form.areaArr[0],
              city_id: this.form.areaArr[1],
              area_id: this.form.areaArr[2],
              town_id: '',
              special_tipe: special.join(','),
              // health: healthlist.join(',')
            })
            delete params['areaArr'];
            solderAdd(params).then(res => {
               this.$message({type: "success",  message: "添加成功" });
               this.cancle()
               this.load()
            })
          }
        })
      }
    },
    load () {
      this.$emit('load')
    },
    cancle () {
      this.$refs.form.resetFields()
      this.$emit('cancle')
    }
  },
  watch: {
    data: {
      handler (newval) {
        const resData = JSON.parse(JSON.stringify(newval));
        if (JSON.stringify(resData) != "{}" && resData.hasOwnProperty('base')) {
          this.$set(this.form, "lng", resData.base.lng);
          // this.$set(this.form, "address", resData.base.address);
          this.$set(this.form, "lat", resData.base.lat);
        } else {
           this.form = resData;
           this.areaString = '';
          if(resData.hasOwnProperty('id')){
            this.getOlderInfo();
          } else {
            this.profile_id_card_front = require("@/assets/images/sfyz_zm.png");
            this.profile_id_card_back = require("@/assets/images/sfyz_fm.png");
          }
        }
      },
      // 可以一进页面就触发监听器  监听器自带的immediate
      immediate: true,
      deep: true
    }
  }
}
</script>

<style lang="scss">
.avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}
</style>
<style lang="scss" scoped>
  .type-add-input {
    textarea {
      font-family: arial;
    }
  }
  .imgUpload-solderAdd{
    .avatar-uploader {
      .el-upload {
        border: 1px dashed #d9d9d9;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        overflow: hidden;
      }
      i.icon-uploader-icon {
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 80px;
        color: #8c939d;
        width: 178px;
        height: 178px;
        vertical-align: bottom;
      }
      img{
         width: 178px;
         height: 178px;
      }
    }
    .avatar-uploader .el-upload:hover {
      border-color: #409EFF;
    }
    i.avatar-uploader-icon{
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 120px;
      color: #8c939d;
      width: 178px;
      height: 178px;
      vertical-align: bottom;
    }
  }
  .avatar-uploader{
    i.avatar-uploader-icon{
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 120px;
      color: #8c939d;
      width: 178px;
      height: 178px;
      vertical-align: bottom;
    }
  }
</style>
